#menu > ul ul {
    left: -9999px; /* XXX first level items out of
            screen for the lists not to overlap */

    visibility: hidden; /* debug */
}

#menu > ul li:hover > ul,
#menu > ul li.hover > ul{
 left: 0;
 top: 100%; /* XXX */
}

/* for the second level items not to overlap */
#menu > ul ul li > ul{
  left: -999px;
  
}

#menu > ul ul li:hover > ul,
#menu > ul ul li.hover > ul{
  

  top: 0;
  left: 99%;
}

